<template>
    <div class="all-list">
        <el-card class="container mt-4">
            <div slot="header" class="clearfix">
                <span><span class="card-header-box"></span>录取结果</span>
                <a href="javascript:;" class="list-button float-right p-1" @click="logout">登出</a>
                <!--<el-button class="float-right p-1" @click="showDialog">查看结果</el-button>-->
            </div>
            <vue-table :data-source="tableList" :queryString="queryModel">
                <template slot="header">
                    <tr>
                        <th scope="col">学生姓名</th>
                        <th scope="col">性别</th>
                        <th scope="col">身份证号</th>
                        <th scope="col">报名幼儿园</th>
                        <!--<th scope="col">操作</th>-->
                    </tr>
                </template>
                <template slot="tbody" slot-scope="props">
                    <tr :class=" props.index % 2 == 0 ? 'table-row':''">
                        <td>{{props.item.name}}</td>
                        <td>{{isSex(props.item.sex)}}</td>
                        <td>{{props.item.id_code}}</td>
                        <td>{{props.item.school_name}}</td>
                        <!--<td>-->
                            <!--<el-tooltip content="修改" placement="top">-->
                                <!--<img src="../../images/updateimg.png" @click="showDialog" height="17" width="17"/>-->
                            <!--</el-tooltip>-->
                            <!--<el-tooltip content="删除" placement="top">-->
                                <!--<img src="../../images/deletedimg.png" @click="deletedUser" height="17" width="17"/>-->
                            <!--</el-tooltip>-->
                        <!--</td>-->
                    </tr>
                </template>
            </vue-table>
        </el-card>
        <div class=" mt-4">
            <cplanet-pagination :page-count="tableList.meta.last_page"
                                :total="tableList.meta.total"
                                :current-page="tableList.meta.current_page" @goPage="goPage"></cplanet-pagination>
        </div>
    </div>
</template>
<script>
  import ListDataSource from '../libs/ListDataSource.js'
  import DataApi from '../api/data'
  import Cookie from 'js-cookie';
  export default {
    data(){
      return{
        tableList: new ListDataSource('/api/student-enroll'),
        queryModel:{}
      }
    },
    created () {
      let vm = this
      this.isLoading = true
      console.log(this.$route.params)
      Promise.all([
        vm.tableList.fetchData(vm.$route.params)
      ]).then(([Response]) => {
        vm.isLoading = false
      }).catch((error) => {
        vm.isLoading = false
      })
    },
    methods: {
      goPage: function (event) {
        let self = this
        let query = _.assign({page: event.page,keyword:self.$route.params.keyword}, self.queryString);
        self.tableList.fetchData(query)
      },
      isSex(type){
        switch (type)
        {
          case '1':
            return '男'
            break;
          default:
            return '女'
        }
      },
      logout(){
        axios.post('/api/logout', {})
          .then(function (response) {
            Cookie.remove('user');
            window.location.reload();
          })
          .catch(function (error) {
            console.log(error);
          });
      },
//      showDialog(){
//
//      },
//      deletedUser(){
//
//      }
    }
  }
</script>
